var hzh = `
<div class="article-header-box">
<div class="article-header">
    <div class="article-title-box">
        <h1 class="title-article" id="articleContentId">js数组常用api</h1>
    </div>
    <div class="article-info-box">
        <div class="article-bar-top">
            <img class="article-type-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/original.png" alt="">
            <div class="bar-content">
            <a class="follow-nickName " href="https://blog.csdn.net/Hanyu__yu" target="_blank" rel="noopener">大马憨鱼</a>
            <img class="article-time-img article-heard-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/newCurrentTime2.png" alt="">
            <span class="time">于&nbsp;2021-12-05 22:31:03&nbsp;发布</span>
            <img class="article-read-img article-heard-img" src="https://csdnimg.cn/release/blogv2/dist/pc/img/articleReadEyes2.png" alt="">
            <span class="read-count">17</span>
            <a id="blog_detail_zk_collection" class="un-collection" data-report-click="{&quot;mod&quot;:&quot;popu_823&quot;,&quot;spm&quot;:&quot;1001.2101.3001.4232&quot;,&quot;ab&quot;:&quot;new&quot;}">
                <img class="article-collect-img article-heard-img un-collect-status isdefault" style="display:inline-block" src="https://csdnimg.cn/release/blogv2/dist/pc/img/tobarCollect2.png" alt="">
                <img class="article-collect-img article-heard-img collect-status isactive" style="display:none" src="https://csdnimg.cn/release/blogv2/dist/pc/img/tobarCollectionActive2.png" alt="">
                <span class="name">收藏</span>
                <span class="get-collection">
                </span>
            </a>
            </div>
        </div>
        <div class="blog-tags-box">
            <div class="tags-box artic-tag-box">
                    <span class="label">文章标签：</span>
                        <a data-report-click="{&quot;mod&quot;:&quot;popu_626&quot;,&quot;spm&quot;:&quot;1001.2101.3001.4223&quot;,&quot;strategy&quot;:&quot;javascript&quot;,&quot;ab&quot;:&quot;new&quot;}" class="tag-link" href="https://so.csdn.net/so/search/s.do?q=javascript&amp;t=blog&amp;o=vip&amp;s=&amp;l=&amp;f=&amp;viparticle=" target="_blank" rel="noopener">javascript</a>
                        <a data-report-click="{&quot;mod&quot;:&quot;popu_626&quot;,&quot;spm&quot;:&quot;1001.2101.3001.4223&quot;,&quot;strategy&quot;:&quot;前端&quot;,&quot;ab&quot;:&quot;new&quot;}" class="tag-link" href="https://so.csdn.net/so/search/s.do?q=前端&amp;t=blog&amp;o=vip&amp;s=&amp;l=&amp;f=&amp;viparticle=" target="_blank" rel="noopener">前端</a>
                        <a data-report-click="{&quot;mod&quot;:&quot;popu_626&quot;,&quot;spm&quot;:&quot;1001.2101.3001.4223&quot;,&quot;strategy&quot;:&quot;typescript&quot;,&quot;ab&quot;:&quot;new&quot;}" class="tag-link" href="https://so.csdn.net/so/search/s.do?q=typescript&amp;t=blog&amp;o=vip&amp;s=&amp;l=&amp;f=&amp;viparticle=" target="_blank" rel="noopener">typescript</a>
            </div>
        </div>
        <div class="slide-content-box">
            <div class="article-copyright">
                <div class="creativecommons">
                    版权声明：本文为博主原创文章，遵循<a href="http://creativecommons.org/licenses/by-sa/4.0/" target="_blank" rel="noopener"> CC 4.0 BY-SA </a>版权协议，转载请附上原文出处链接和本声明。
                </div>
                <div class="article-source-link">
                    本文链接：<a href="https://blog.csdn.net/Hanyu__yu/article/details/121737026" target="_blank">https://blog.csdn.net/Hanyu__yu/article/details/121737026</a>
                </div>
            </div>
        </div>
        <div class="operating">
            <a class="href-article-edit slide-toggle">版权</a>
        </div>
    </div>
</div>
</div>
<article class="baidu_pl">
<div id="article_content" class="article_content clearfix">
<link rel="stylesheet" href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/ck_htmledit_views-d7093e7f7c.css">
        <div id="content_views" class="markdown_views prism-atom-one-dark">
            <svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
                <path stroke-linecap="round" d="M5,0 0,2.5 5,5z" id="raphael-marker-block" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></path>
            </svg>
            <p>修改原数组的API<br> pop（）：弹出数组中最后一个元素，并返回这个元素</p> 
<p>let arr = [1,2,3,4,5,6]<br> let result = arr.pop()<br> console.log(arr) // [1, 2, 3, 4, 5]<br> console.log(result) // 6<br> push（）：添加一个或多个元素到数组末尾，并返回新的长度</p> 
<p>let arr = [1,2,3,4,5,6]<br> arr.push(7,8)<br> console.log(arr) // [1, 2, 3, 4, 5, 6, 7, 8]<br> console.log(arr.length) // 8<br> shift（）：弹出数组的第一个元素，并返回这个元素</p> 
<p>let arr = [1,2,3,4,5,6]<br> let result = arr.shift()<br> console.log(arr) // [2, 3, 4, 5, 6]<br> console.log(result) // 1<br> unshift（）：在数组开头添加一个或多个元素，并返回新的长度</p> 
<p>let arr = [1,2,3,4,5,6]<br> arr.unshift(-1,0)<br> console.log(arr) // [-1, 0, 1, 2, 3, 4, 5, 6]<br> console.log(arr.length) // 8<br> splice（x，n，…）：从x位置开始截取，截取n个并返回被截取的元素，第三个参数是截取完了需要添加哪些元素，从x的位置开始添加</p> 
<p>从数组的第1位开始截取，截取3位并返回，再从第1位开始添加‘x’‘y’‘z’</p> 
<p>let arr = [1,2,3,4,5,6]<br> let result = arr.splice(1,3,‘x’,‘y’,‘z’)<br> console.log(arr) // [1, “x”, “y”, “z”, 5, 6]<br> console.log(result) // [2, 3, 4]<br> .reverse（）：逆转数组的顺序</p> 
<p>let arr = [1,2,3,4,5,6]<br> arr.reverse()<br> console.log(arr) // [6, 5, 4, 3, 2, 1]<br> sort（）：给数组排序(默认从小到大)</p> 
<p>let arr = [1,6,4,3,5,2]<br> arr.sort()<br> console.log(arr) // [1, 2, 3, 4, 5, 6]<br> sort还可以接受一个函数作为参赛，该函数接受两个参数 a，b</p> 
<p>如果a &lt; b就返回一个负数，a就排在b的前面</p> 
<p>如果a === b就返回0，顺序不变</p> 
<p>如果a &gt; b就返回一个正数，a就排在b的后面</p> 
<p>let arr = [1,6,4,3,5,2]<br> arr.sort((a, b) =&gt; {<!-- --><br> if (a &lt; b) {<!-- --><br> return -1<br> }else if (a === b) {<!-- --><br> return 0<br> }else{<!-- --><br> return 1<br> }<br> })<br> console.log(arr) // [1, 2, 3, 4, 5, 6]<br> 可以简写为</p> 
<p>let arr = [1,6,4,3,5,2]<br> arr.sort((a, b) =&gt; a - b)<br> console.log(arr) // [1, 2, 3, 4, 5, 6]<br> 同理，返回b - a就可以倒序排列</p> 
<p>let arr = [1,6,4,3,5,2]<br> arr.sort((a, b) =&gt; b - a)<br> console.log(arr) // [6, 5, 4, 3, 2, 1]<br> 返回新数组的API<br> concat（）：把传入的数组，或者元素+数组合并成一个新的数组，返回这个新数组</p> 
<p>let arr = [1,2,3]<br> let arr2 = [4,5,6]<br> let newArr = arr.concat(arr2)<br> console.log(newArr) // [1, 2, 3, 4, 5, 6]<br> slice（）：截取数组，不会改变原数组</p> 
<p>从数组的第0位截取到数组的第3位</p> 
<p>let arr = [1,2,3,4,5,6]<br> let result = arr.slice(0,3)<br> console.log(result) // [1, 2, 3]<br> 如果不给第二个参数，那么就从第1个参数的位置截取到数组的最后</p> 
<p>let arr = [1,2,3,4,5,6]<br> let result = arr.slice(3)<br> console.log(result) // [4, 5, 6]<br> join（）：把数组中的元素连接成一个字符串并返回，不会改变原数组</p> 
<p>可以选择用什么作为分隔符，空字符串就代表没有分隔符</p> 
<p>let arr = [1,2,3,4,5,6]<br> let result = arr.join(’’)<br> console.log(arr) // [1, 2, 3, 4, 5, 6]<br> console.log(result) // ‘123456’<br> indexOf（）：查找元素在数组中第一次出现时的索引，如果没有就返回-1</p> 
<p>let arr = [1,2,3,4,5,6,1,2,3,4,5,6]<br> let result = arr.indexOf(3)<br> console.log(result) // 2<br> LastIndexOf（）：查找元素在数组中最后一次出现时的索引，如果没有就返回-1</p> 
<p>let arr = [1,2,3,4,5,6,1,2,3,4,5,6]<br> let result = arr.indexOf(3)<br> console.log(result) // 8<br> 数组遍历方法<br> forEarm（）：传入一个函数，把数组的每一项作为函数的参数被调用，不改变原数组</p> 
<p>let arr = [1, 2, 3, 4, 5, 6];<br> arr.forEach((item) =&gt; {<!-- --><br> console.log(item) // 依次输出1到6<br> });<br> map（）：传入一个函数，把数组的每一项作为函数的参数被调用，然后用函数每次的返回值组成新的数组并返回，不改变原数组</p> 
<p>let arr = [1, 2, 3, 4, 5, 6];<br> let newArr = arr.map((item) =&gt; item*item); // 箭头函数的简写,不用写return<br> console.log(arr) // [1, 2, 3, 4, 5, 6]<br> console.log(newArr) // [1, 4, 9, 16, 25, 36]<br> filter（）：传入一个函数，把数组的每一项作为函数的参数被调用，在函数内部判断符合条件的每一项，把它们组成新的数组并返回，不改变原数组</p> 
<p>let arr = [1, 2, 3, 4, 5, 6];<br> let newArr = arr.filter((item) =&gt; item%2 === 0); // 取数组中的偶数<br> console.log(arr) // [1, 2, 3, 4, 5, 6]<br> console.log(newArr) // [2, 4, 6]<br> reduce（）：接受两个参数，函数和初始值，其中函数接受两个参数，那个初始值和数组的每一项，每次用初始值对数组的每一项进行操作并返回这个新的初始值（函数返回），不改变原数组</p> 
<p>初始值为0，sum代表了初始值，每次用sum+= item，最后初始值为21并被返回（reduce返回）</p> 
<p>let arr = [1, 2, 3, 4, 5, 6];<br> let result = arr.reduce((sum, item) =&gt; sum+=item,0);<br> console.log(arr) // [1, 2, 3, 4, 5, 6]<br> console.log(result) // 21</p>
        </div>
        <link href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/markdown_views-89f5acb30b.css" rel="stylesheet">
        <link href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/style-49037e4d27.css" rel="stylesheet">
</div>
<div id="treeSkill"></div>
</article>

<script>
$(function() {
setTimeout(function () {
var mathcodeList = document.querySelectorAll('.htmledit_views img.mathcode');
if (mathcodeList.length > 0) {
var testImg = new Image();
testImg.onerror = function () {
  mathcodeList.forEach(function (item) {
    $(item).before('<span class="img-codecogs">\\(' + item.alt + '\\)</span>');
    $(item).remove();
  })
  MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
}
testImg.src = mathcodeList[0].src;
}
}, 1000)
})
</script>
`